@import '@/styles/color.less';
@import '@/styles/token';

.header {
  height: 56px;
  border-bottom: 1px solid @WHITE15;

  .icon {
    color: @GRAY10;
    font-size: 14px;
    margin-right: 4px;
  }

  .name {
    font-size: 16px;
    font-weight: normal;
    color: @BLANK04;
  }

  .extra-box {
    gap: 20px;

    .save-btn {
      background-color: @WHITE13;
      color: @BLUE05;
      border-color: @GRAY30;

      &:hover {
        background-color: @WHITE13;
        border-color: transparent;
        color: @BLUE05;
        opacity: 0.8;
      }
    }
  }
}

@media (max-width: 768px) {
  .header {
    width: 100%;
    overflow-x: auto;

    .extra-box {
      gap: 8px;
    }
  }
}
